<html>
<head>
	<title>poop</title>
	<script language="javascript">
var num = 1;
var	str = "test";

var arry = ["a", "d", "test", 12]; // zero based index (0,1,2,3)
var myArrayLength = arry.length;
var thirdElement = arry[2];

function perryRules() {
	document.title = "YOU ARE PERRY!!!";
	var answer = prompt("Hey - what do you think of perry? Is he silly?");
	if (answer == "yes") alert("you are correct!");
}

//alert(myArrayLength + " " + thirdElement); //4 test
	
function divMouseDown(meTheDiv, colorName) {
	if (colorName == null) colorName = "blue";
	meTheDiv.style.backgroundColor = colorName;
	/*var divs = document.getElementsByTagName('div');
	for (var x=0; x < divs.length; x++) {
		var div = divs[x];
		div.style.backgroundColor = "pink";
	}*/
}

function divMouseUp(meTheDiv) {
	meTheDiv.style.backgroundColor = "white";
	
	/*var divs = document.getElementsByTagName('div');
	var y = 0;
	while (y < divs.length) {
		var div = divs[y];
		div.style.backgroundColor = "white";
		y++; //y = y + 1; y += 1;
	}*/
}


function divMouseOver(meTheDiv, colorName) {
	if (colorName == null) colorName = "orange";
	meTheDiv.style.color = colorName;
	meTheDiv.style.fontStyle = "italic";
	
	/*var divs = document.getElementsByTagName('div');
	for (var x=0; x < divs.length; x++) {
		var div = divs[x];
		div.style.color = "red";
		div.style.fontStyle = "italic";
	}*/
}

function divMouseOut(meTheDiv) {
	meTheDiv.style.color = "black";
	meTheDiv.style.fontStyle = "";
	
	/*var divs = document.getElementsByTagName('div');
	var y = 0;
	while (y < divs.length) {
		var div = divs[y];
		div.style.color = "black";
		div.style.fontStyle = "";
		y++; //y = y + 1; y += 1;
	}*/
}

function divClick(e, url) {
	document.location = url;
}

var penIsDown = false;

function drawStuff(e) {
	if (penIsDown) {
		var newDiv = document.createElement("div");
		newDiv.style.top = e.clientY;
		newDiv.style.left = e.clientX;
		newDiv.style.position = "absolute";
		newDiv.style.backgroundColor = "rgb(" + parseInt(Math.random() * 255) + "," +parseInt(Math.random() * 255)+ "," +parseInt(Math.random() * 255)+ ")";
		newDiv.style.height = "25px";
		newDiv.style.width = "25px";
		
		document.body.appendChild(newDiv)
	}
}

	</script>
</head>
<body onload="perryRules()" onmousemove="drawStuff(event)" onmousedown="javascript: penIsDown=true;" onmouseup="javascript: penIsDown=false;">
	<div style="width:250px; border:solid black 1px;text-align:center" 
		onmousedown="divMouseDown(this, 'pink')" 
		onmouseup="divMouseUp(this)" 
		onmouseover="divMouseOver(this, 'olive')" 
		onmouseout="divMouseOut(this)"
		onclick="divClick(event, 'https://www.google.com/search?q=cow+poop&site=imghp&tbm=isch')"> 
		Show me pictures of cow poop!
	</div>
	
	<div style="width:250px; border:solid black 1px;text-align:center" 
		onmousedown="divMouseDown(this, 'green')" 
		onmouseup="divMouseUp(this)" 
		onmouseover="divMouseOver(this, 'lime')" 
		onmouseout="divMouseOut(this)"
		onclick="divClick(event, 'http://www.drudgereport.com/')"> 
		Take me to the Drudge Report!
	</div>
	
	<div style="width:250px; border:solid black 1px;text-align:center" 
		onmousedown="divMouseDown(this, 'orange')" 
		onmouseup="divMouseUp(this)" 
		onmouseover="divMouseOver(this, 'red')" 
		onmouseout="divMouseOut(this)"
		onclick="divClick(event, 'https://www.gmail.com')"> 
		Check my Email!
	</div>
</body>
</html>